<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .logo{
            float: left;
            width: 33%;
            height: 60px;
            line-height: 60px;
        }
        .meun{
            color: white;
            text-decoration: none;
            line-height:50px ;
        }
        .zhuce{
            background-image: url("8.jpg");
            height: 500px;
            width: 100%;
        }

    </style>
</head>
<body>
<!--       内边距
            padding
            外边距
            margin
            css 绝对定位
            postion:absultte
            top:控制距离顶部的位置
            left 控制距离左边的位置


 -->
<!--
            第一部分 logo部分
            第二部分 导航栏
            第三部分 注册部分
            第四部分 页脚
            第五部分 注释部分


-->
        <div>
<!--                第一部分 logo部分-->./
            <div >
                <div class="logo">
                    <img src="./logo.jpg" alt="">
                </div>
                <div class="logo">
                    <img src="./zhengpin.jpg" alt="">
                </div>
                <div class="logo" >
                    <a href="#">登陆</a>
                    <a href="#">注册</a>
                    <a href="#">黑马</a>
                </div>
            </div>
<!--                第二部分 导航栏-->
            <div style="clear: both;"></div>
            <div style="background-color: black;height: 50px">
                <a href="#" class="meun">手机</a>
                <a href="#" class="meun">手机1</a>
                <a href="#" class="meun">手机2</a>
                <a href="#" class="meun">手机3</a>
            </div>
<!--                第三部分 注册部分-->
            <div class="zhuce">
                <div style="height: 40%;width: 50%;background-color: white;border: 3px solid red;position: absolute;top:200px;left: 370px">
                    <table  align="center">
                       <tr >
                        <td  colspan="2">
                           <font color="red" size="6">会员注册</font> user register
                        </td>
                    </tr>
                        <tr>
                            <td>
                                用户名 <input type="text" placeholder="请输入">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                密码 <input type="password"placeholder="请输入">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                确认密码<input type="password"placeholder="请输入">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                email<input type="email"placeholder="请输入">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                姓名 <input type="text" placeholder="请输入">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                性别 <input type="radio" name="sex">男
                                <input type="radio" name="sex">女
                            </td>
                        </tr>
                        <tr>
                            <td>
                               出生日期<input type="date">
                            </td>
                        </tr>
                        <tr>
                            <td>
                                验证码<input type="text">
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2">
                                <input type="submit" value="提交">
                                <td></td>
                            </td>
                        </tr>

                    </table>
                </div>
            </div>
<!--                第四部分 页脚-->
            <div>
                <img src="./7.jpg" alt="" width="100%">
            </div>
<!--                第五部分 注释部分-->
            <div style="text-align: center">
                <a href="#" >招贤纳什</a>
                <a href="#">招贤纳什</a>
                <a href="#">招贤纳什</a>
                <a href="#">招贤纳什</a>
            </div>
        </div>
</body>
</html>